import 'package:flutter/material.dart';

class SkeletonLoader extends StatelessWidget {
  final double height;
  final double width;
  final double borderRadius;

  const SkeletonLoader({
    Key? key,
    this.height = 20,
    this.width = double.infinity,
    this.borderRadius = 8,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      height: height,
      width: width,
      decoration: BoxDecoration(
        color: Colors.grey[300],
        borderRadius: BorderRadius.circular(borderRadius),
      ),
    );
  }
}

class QuestionSkeletonLoader extends StatelessWidget {
  const QuestionSkeletonLoader({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Card(
      margin: const EdgeInsets.only(bottom: 16),
      elevation: 2,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
      child: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                const SkeletonLoader(width: 60, height: 24),
                const SizedBox(width: 8),
                const SkeletonLoader(width: 80, height: 16),
              ],
            ),
            const SizedBox(height: 12),
            const SkeletonLoader(height: 16),
            const SizedBox(height: 8),
            const SkeletonLoader(height: 16),
            const SizedBox(height: 12),
            const Center(
              child: SkeletonLoader(height: 150, width: 200),
            ),
          ],
        ),
      ),
    );
  }
}
